import { Row, Col } from 'antd';
import { useTranslation } from 'react-i18next';

import sy from '@/assets/new/sy.png'
import gd from '@/assets/new/gd.png'
import jl from '@/assets/new/jl.png'
import wd from '@/assets/new/wd.png'
import qb from '@/assets/new/qb.png'


import './navBarBottom.scss';
import { useNavigate } from 'react-router-dom';
import { useState } from 'react';

export default () => {
    const { t } = useTranslation();
    const navigate = useNavigate()
    const [seleKey, setSeleKey] = useState('/dashboard/home')
    const toPage = (path) => {
        setSeleKey(path)
        navigate(path)
    }
    return (
        <Row justify="space-around" align="middle" className="nav-wrapper">
            <Col span={4.8}>
                <div className={seleKey == '/homePC' ? 'nav-item active-nav' : 'nav-item'} onClick={() => { toPage('/pc') }}>
                    <span>
                        <img src={sy} />
                    </span>
                    <span>{t('官网')}</span>
                </div>
            </Col>
            <Col span={4.8}>
                <div className="nav-item">
                    <span>
                        
                        { <img src={gd} /> }
                    </span>
                    <span>跟单</span>
                </div>
            </Col>
            <Col span={4.8}>
                <div className={seleKey == '/dashboard/ethbot' ? 'nav-item active-nav' : 'nav-item'} onClick={() => { toPage('/dashboardPC/ethbot') }}>
                    <span>
                        <img src={qb} />
                    </span>
                    <span>钱包</span>
                   
                </div>
            </Col>
            <Col span={4.8}>
                <div className={seleKey == '/dashboard/Reward' ? 'nav-item active-nav' : 'nav-item'} onClick={() => { toPage('/dashboardPC/Reward') }}>
                    <span>
                    <img src={jl} />
                    </span>
                    <span>奖励</span>
                </div>
            </Col>
            <Col span={4.8}>
                <div className={seleKey == '/dashboard/home' ? 'nav-item active-nav' : 'nav-item'} onClick={() => { toPage('/dashboardPC/home') }}>
                    <span>
                        <img src={wd} />
                    </span>
                    <span>{t('仪表盘')}</span>
                </div>
            </Col>
        </Row>
    );
};
